import React from 'react';
import * as service from '../../../../../api/zynindex'
import * as asset from '../../../../../api/ningindex'
import { useNavigate } from 'react-router-dom'
import '../AddInventory/AddInventory.scss'
import { Button, Layout, Input, theme, TreeSelect, Space, Tag, Modal, Form, Select, DatePicker, message, Divider } from 'antd';

const { Content } = Layout;
const { Option } = Select;

interface Props {

}

function AddInventory(props: Props) {
    const [messageApi, contextHolder] = message.useMessage()
    var navigate = useNavigate()
    const info = () => {
        messageApi.info('新增成功');
        // navigate(-1)
    };
    const {
        token: { colorBgContainer },
    } = theme.useToken();

    // 新增盘点
    const onFinish = async (values: any) => {
        // console.log(values);
        var res = await service.inventory_add(values)
        console.log(res);
    };

    const tolist = () => {
        navigate(-1)
    }
    return (
        <div className='add'>
            <Content
                style={{
                    padding: 24,
                    margin: 0,
                    minHeight: 280,
                    background: colorBgContainer,
                }}
            >
                <div className="shang">
                    <div className="line"> </div>
                    <div className="set">新增盘点</div>
                </div>
                <Form
                    name="basic"
                    labelCol={{ span: 8 }}
                    wrapperCol={{ span: 16 }}
                    style={{ maxWidth: 500 }}
                    initialValues={{ remember: true }}
                    onFinish={onFinish}
                    // onFinishFailed={onFinishFailed}
                    autoComplete="off">
                            <Form.Item
                                label="盘点名称"
                                name="name"
                                rules={[{ required: true, message: '请输入盘点名称' }]}
                            >
                                <Input placeholder='请输入' />
                            </Form.Item>
                                <Form.Item label="盘点人员" name='two'>
                                    <Select>
                                        <Select.Option value="敬光熙">敬光熙</Select.Option>
                                        <Select.Option value="涂琼英">涂琼英</Select.Option>
                                    </Select>
                                </Form.Item>
                        <Form.Item label="预计完成日期" name="plandate">
                            <DatePicker placeholder='请选择' />
                        </Form.Item>
                    <Divider orientation="left" orientationMargin="0">
                        <div className="parttwo">
                            <div className="zhong">
                                <div className="line"> </div>
                                <div className="set">资产盘点范围</div>
                            </div>
                        </div>
                    </Divider>
                    <Form.Item label="资产类别">
                        <TreeSelect
                            treeData={[
                                {
                                    title: '电子产品及通讯设备', value: '电子产品及通讯设备',
                                    children: [
                                        { title: '电脑', value: '电脑' },
                                        { title: '投影仪', value: '投影仪' },
                                        { title: '录音设备', value: '录音设备' },
                                    ]
                                },
                                {
                                    title: '办公用品', value: '办公用品',
                                    children: [
                                        { title: '笔记本', value: '笔记本' },
                                        { title: '笔', value: '笔' },
                                        { title: '纸张', value: '纸张' },
                                    ]
                                },

                            ]}
                        />
                    </Form.Item>
                    <Form.Item label="所属部门">
                        <TreeSelect
                            treeData={[
                                {
                                    title: '黛西进出口贸易公司', value: '黛西进出口贸易公司',
                                    children: [
                                        {
                                            title: '杭州分公司', value: '杭州分公司',
                                            children: [
                                                { title: '行销部', value: '行销部' },
                                                { title: '设计部', value: '设计部' }
                                            ]
                                        },
                                        { title: '产品部', value: '产品部' }
                                    ]
                                },

                            ]}
                        />
                    </Form.Item>
                    <Form.Item label="存放仓库">
                        <Select>
                            <Option value="请选择">请选择</Option>
                            <Option value="本地仓库">本地仓库</Option>
                            <Option value="东仓">东仓</Option>
                            <Option value="西仓">西仓</Option>
                            <Option value="南仓">南仓</Option>
                            <Option value="北仓">北仓</Option>
                        </Select>
                    </Form.Item>
                    <div className="btn">
                        <Space>
                            {contextHolder}
                            <Button type="primary" htmlType='submit' onClick={info}>提交</Button>
                            <Button onClick={() => { tolist() }}>取消</Button>
                        </Space>
                    </div>
                </Form >
            </Content >
        </div >
    );
}

export default AddInventory;